.navBox {
  min-height: 100%;
	min-width: 208px;
  background: var(--color-nav-bg) !important;
	:global {
		.ant-menu-item, .ant-menu-item-group-title, .ant-menu-item>a, .ant-menu-item>span>a, .ant-menu-title-content {
			color: var(--color-menu-not-selected) !important;
		}
		.ant-menu-item.ant-menu-item-only-child, .ant-menu-submenu-title {
			padding-left: 40px !important;
		}
		.ant-menu-submenu-open {
			background: var(--color-nav-bg) !important;
			color: var(--color-menu-not-selected) !important;
		}
		.ant-menu-item-selected.ant-menu-item-only-child a {
			color: var(--color-white) !important;
		}
		.ant-menu-item-selected.ant-menu-item-only-child {
			background-color: var(--color-black) !important;
			position: relative;
			&::before {
				content: '';
				display: inline-block;
				width: 4px;
				height: 100%;
				background: var(--color-primary);
				position: absolute;
				left: 0;
				top: 0;
			}
		}
		.ant-menu-sub {
  		background: var(--color-nav-bg) !important;
		}
	}
}
.navBtn {
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  .navImg {
    margin-right: 10px;
    background-image: url(/src/assets/images/default.png);
    background-size: cover;
    background-repeat: no-repeat;
    height: 20px;
    width: 20px;
    cursor: pointer;
    background-position: 100% 0;
  }
}
.baseSel {
  background-image: url('/src/assets/images/nav/sel.png');
  width: 20px;
  height: 20px;
  &.monitor {
    background-position: 0px -46px;
  }
  &.task {
    background-position: -28px -46px;
  }
  &.alert {
    background-position: -56px -46px;
  }
  &.keyword {
    background-position: -84px -46px;
  }
  &.log {
    background-position:-110px -46px;
  }
  &.backup {
    background-position: -140px -46px;
  }
  &.bug {
    background-position: -167px -46px;
  }
  &.network {
    background-position: -0px -71px;
  }
  &.update {
    background-position:  -28px -71px;
  }
  &.product {
    background-position: -56px -71px;
  }
  &.systemStatus {
    background-position: -84px -71px;
  }
  &.user {
    background-position: -112px -71px;
  }
  &.remote {
    background-position: -140px -71px;
  }
}

.Menu:hover .baseNoSel{
  background-image: url('/src/assets/images/nav/sel.png');
}
.baseNoSel {
  width: 20px;
  height: 20px;
  background-image: url('/src/assets/images/nav/nosel.png');
  &.monitor {
    background-position: 0px -46px;
  }
  &.task {
    background-position: -28px -46px;
  }
  &.alert {
    background-position: -56px -46px;
  }
  &.keyword {
    background-position: -84px -46px;
  }
  &.log {
    background-position:-112px -46px;
  }
  &.backup {
    background-position: -140px -46px;
  }
  &.bug {
    background-position: -167px -46px;
  }
  &.network {
    background-position: -0px -71px;
  }
  &.update {
    background-position:  -28px -71px;
  }
  &.product {
    background-position: -56px -71px;
  }
  &.systemStatus {
    background-position: -84px -71px;
  }
  &.user {
    background-position: -112px -71px;
  }
  &.remote {
    background-position: -140px -71px;
  }
}
